<template>

    <div style=" background-color: #fff;height: 14vw;">
      <span class="n-title" >请绑定情侣信息（一方绑定即可）</span>

      <span class="n-addnote">
        <!-- <van-icon name="add" size="6vw" color="#5dacdd" @click="onAddNote"/> -->
      </span>
    </div>

    <div class="shade"></div>

    <van-popup v-model:show="showPicker" position="bottom">
          <van-date-picker @confirm="onConfirm" @cancel="showPicker = false" />
    </van-popup>


    <div style="height:6px;background-color: rgb(240,240,240);"></div>

              <van-cell-group inset>
                <van-field
                  v-model="userPhone"
                  name="电话号码"
                  label="对方号码"
                  placeholder="电话号码"
                />
                <van-field
                  v-model="password"
                  type="password"
                  name="密码"
                  label="对方密码"
                  placeholder="密码"
                />
                <van-field
                  v-model="startTime"
                  is-link
                  readonly
                  name="datePicker"
                  label="纪念日"
                  placeholder="点击选择时间"
                  @click="showPicker = true"
                />
              </van-cell-group>
              <div style="margin: 8vw">
                <van-button round block type="primary" @click="onPair">绑定</van-button>
              </div>


  </template>
  <script>
  import { showFailToast,showToast } from 'vant'
  import axios from 'axios'
  
  
  export default {
    name: 'PairView',
    data () {
      return{
        userId:0,
        showPicker:false,
        active:0,
        userPhone:"",
        password:"",
        startTime:"",
      }
    },
    activated(){
      this.userId = localStorage.getItem("id")
      if(this.userId==null){
        this.$router.replace("/login")
      }
    },
    // props: ['login'],
    methods: {
     onPair(){
      if(this.userPhone==""||this.password==""||this.birthday==""){
        showToast("请填写完整！")
        return
      }
      axios.get("/api/Login/pair",{
            params:{
              userId:this.userId,
              userPhone:this.userPhone,
              password: this.password,
              startTime: (new Date(this.startTime)).getTime()
            }
          }).then((res)=>{
            console.log(res)
              showToast(res.data.message)
              if(res.data.data==true){
                this.$router.replace("/home/diary")
              }
          }).catch((err)=>{console.log(err)})
        //手动读取本地存储的user消息，一并传入axios请求
        //绑定成功跳转到diary
        
     },
     onConfirm({selectedValues}){
      this.startTime = selectedValues.join('-');
      this.showPicker = false;
     }
  
    }
  }
  </script>

  <style>
  
  </style>
  